<#include "../common/header.htm">
<div class="content-wrapper">
	<section class="content-header">
		<ol class="breadcrumb">
			<li><a href="${ctx}/">首页</a></li>
			<li class="active"><a href="${ctx}/workform/form">新增工单</a></li>
		</ol>
	</section>
	<section class="content">
        <h4 style="padding: 20px 0;border-bottom: 1px solid #e5e5e5">基本信息：</h4>   
        <div class="basic-info-wrapper">
        	<!-- 右侧区域 -->
			<div class="right-box" style="padding:10px 17px;">
				<dl>
					<dt>1、代理商模板文件下载：</dt>
					<dd><a href="${ctx}/downloadFile/SIM卡开户表_代理商名称_客户名称.docx">SIM卡开户表_代理商名称_客户名称.docx</a></dd>
					<dd><a href="${ctx}/downloadFile/SIM卡变更表_代理商名称_客户名称.docx">SIM卡变更表_代理商名称_客户名称.docx</a></dd> 
					<dd><a href="${ctx}/downloadFile/SIP线路开户表_代理商名称_客户名称.docx">SIP线路开户表_代理商名称_客户名称.docx</a></dd>
					<dd><a href="${ctx}/downloadFile/SIP线路变更表_代理商名称_客户名称.docx">SIP线路变更表_代理商名称_客户名称.docx</a></dd>
					<dd><a href="${ctx}/downloadFile/SIP线路话术变更表_代理商名称_客户名称.docx">SIP线路话术变更表_代理商名称_客户名称.docx</a></dd>
					<dd><a href="${ctx}/downloadFile/SIM卡-话术变更表_代理商名称_客户名称.docx">SIM卡-话术变更表_代理商名称_客户名称.docx</a></dd>
				</dl>
				<dl>
					<dt>2、直销客户模板文件下载：</dt>
					<dd><a href="${ctx}/downloadFile/SIM卡开户表_销售_客户名称.docx">SIM卡开户表_销售_客户名称.docx</a></dd>
					<dd><a href="${ctx}/downloadFile/SIM卡变更表_销售_客户名称.docx">SIM卡变更表_销售_客户名称.docx</a></dd> 
					<dd><a href="${ctx}/downloadFile/SIP线路开户表_销售_客户名称.docx">SIP线路开户表_销售_客户名称.docx</a></dd>
					<dd><a href="${ctx}/downloadFile/SIP线路变更表_销售_客户名称.docx">SIP线路变更表_销售_客户名称.docx</a></dd>
				</dl>
			</div>
			
        	<!-- 左侧区域 -->
			<form action="${ctx}/workform/form" method="post" enctype="multipart/form-data" class="left-box" id="addWorkform">
				<input type="hidden" name="orderId" value="${orderId!}" />
				<input type="hidden" name="userType" value="${userType}" />
				<input type="hidden" name="id" value="${workform.id!}" />
				<div class="form-group form-inline row">
					<label class="input_text"><span style="color: red">* </span>标题：</label> 
					<input class="form-control" type="text"	name="title" value="${workform.title!}" style="width: 320px;" placeholder="请输入客户名称和路数" maxlength="40" unContainEscapeChar="true" required />
				</div>
			    <div class="form-group form-inline row">
					<label class="input_text"><span style="color: red">* </span>类型：</label> 
					<select class="form-control" style="width: 200px;" name="businessParentType" >
						<option value="">请选择</option>
						<#list parentTypeMap as key, value>
							<option value="${key}">${value}</option>
						</#list>
					</select>
					<select class="form-control" style="width: 200px;" name="businessType" required >
						<option value="">请选择</option>
					</select>
				</div>
				<div class="form-group form-inline row">
					<label class="input_text"><span style="color: red">* </span>计费：</label> 
					<select class="form-control" style="width: 200px;" name="clearingForm" required >
						<option value="">请选择</option>
						<#list clearingFormMap as key, value>
							<option value="${key}">${value}</option>
						</#list>
					</select>
					<select class="form-control" style="width: 200px; display: none;" id="clearingFormMonths" >
					</select>
					<input type="hidden" name="clearingFormMonths" />
				</div>
				<div class="form-group form-inline row">
					<label class="input_text"><span style="color: red">* </span>线路：</label>
					<input class="form-control" type="number" min="0" max="9999" name="lineNum" value="${workform.lineNum!0}" style="width: 130px;" required />
					<label style="margin-right: 20px;">路&nbsp;<span style="color:#999;">（线路路数）</span></label>
				</div>
				<div class="form-group form-inline row">
					<label class="input_text"><span style="color: red">* </span>并发：</label>
					<input class="form-control" type="number" min="0" max="9999" name="concurrentNum" value="${workform.concurrentNum!0}" style="width: 130px;" required />
					<label style="margin-right: 20px;">个&nbsp;<span style="color:#999;">（总并发数）</span></label>
				</div>
				<div class="form-group form-inline row receive-people">
				    <label class="input_text">
				    <span style="color: red">* </span>接收人：</label>
				    <#include "./include/receiver.htm">
				</div>
				<div class="form-group form-inline row">
					<label class="input_text">备注：</label>
                    <textarea class="form-control" rows="3" name="remark" style="width:400px;max-width:600px;max-height: 600px;"  placeholder="请输入其他需要说明的内容"  maxlength="1000" >${workform.remark!}</textarea>
				</div>
			    <div class="form-group form-inline row">
					 <label for="exampleInputFile" class="input_text">附件：</label>
                     <input type="file" name="fileupload" style="display: inline-block;" fileMaxSize="1024 * 1024 * 60" multiple="multiple"
                     	accept=".jpg,.jpeg,.png,.txt,.doc,.docx,.xls,.xlsx,.wav,.zip,.rar"
                      />
				</div>
				
				<div style="margin: 30px 60px;">
					<button type="submit" class="btn btn-info">提交</button>&nbsp;&nbsp;
					<button type="button" class="btn btn-default" onclick="myReset();">清空</button>
				</div>
			</form>
		</div>
	</section>
</div>
<script type="text/javascript">
	<#if alertMessage??>
		bootbox.alert("${alertMessage}");
	</#if>
	
	String.prototype.startsWith = function(str) {
		var reg = new RegExp("^"+str);
		return reg.test(this);
	}
	String.prototype.endsWith = function(str) {
		var reg = new RegExp(str+"$");
		return reg.test(this);
	}
	// 表单重置
	function myReset() {
		$("#addWorkform")[0].reset();
		// $("#receiverName").val("");
		$(".select2-selection__rendered").attr("title", "请选择");
		$(".select2-selection__rendered").text("请选择");
	}
	
	/* 可输可选 */
    $('.select2').select2();
    
	/* 工单子类型 */
	var subType = {
		<#list subTypeMap as k, v>
			"${k}": "${v}",
		</#list>
	};
	
	/* 工单父类型切换 */
	$("select[name='businessParentType']").change(function() {
		$("select[name='businessType']").html('<option value="">请选择</option>');
		var parentType = $(this).val();
		if (parentType) {
			for (key in subType) {
				if (key.startsWith(parentType)) {
					$("select[name='businessType']").append('<option value="' + key + '">' + subType[key] + '</option>');
				}
			}
		}		
	});
	
	/* 计费方式切换 */
	$("select[name='clearingForm']").change(function() {
		var clearingForm = $(this).val();
		
		// 1:按年,2:按半年,3:按季,4:按月,5:试用,6:不计费
		if (clearingForm == 1) {
			$("input[name='clearingFormMonths']").val(12);
			$("#clearingFormMonths").hide();
		} else if (clearingForm == 2) {
			$("input[name='clearingFormMonths']").val(6);
			$("#clearingFormMonths").hide();
		} else if (clearingForm == 3) {
			$("input[name='clearingFormMonths']").val(3);
			$("#clearingFormMonths").hide();
		} else if (clearingForm == 4) {
			$("input[name='clearingFormMonths']").val(1);
			$("#clearingFormMonths").show();
			$("#clearingFormMonths").html('');
			for (var i = 1; i <=24; i++) {
				$("#clearingFormMonths").append('<option value="'+i+'">'+i+'个月</option>');
			}
		} else if (clearingForm == 5) {
			$("input[name='clearingFormMonths']").val('');
			$("#clearingFormMonths").hide();
		} else if (clearingForm == 6) {
			$("input[name='clearingFormMonths']").val('');
			$("#clearingFormMonths").hide();
		} else {
			$("input[name='clearingFormMonths']").val('');
			$("#clearingFormMonths").hide();
		}
	});
	/* 计费月数切换 */
	$("#clearingFormMonths").change(function() {
		var months = $(this).val();
		$("input[name='clearingFormMonths']").val(months);
	});
</script>
<#include "../common/footer.htm">
